<!DOCTYPE html>
{% load staticfiles %}
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ blog.title }}</title>
    <style>
        .blog {
            padding: 20px 0px;
        }
        .blog .info span {
            padding-right: 10px;
        }
        .blog .summary {
            padding-top: 20px;
        }
    </style>
</head>
<body>

<div class="header">
    <span><a href="{% url 'blog_get_detail' blog.id %}">{{ blog.title }}</a></span>
</div>

<div class="content">
    <div class="blog">
        <div class="title">
            <a href="#"><h2>{{ blog.title }}</h2></a>
        </div>
        <div class="info">
            <span class="category" style="color: #ff9900;">{{ blog.category.name }}</span>
            <span class="author" style="color: #4a86e8">{{ blog.author }}</span>
            <span class="created" style="color: #6aa84f">{{ blog.created|date:"Y-m-d H:i" }}</span>
        </div>
        <div class="summary">
            {{ blog.content }}
        </div>
    </div>
    <div class="comment">
        <div class="comments-display" style="padding-top: 20px;">
            <h3>评论</h3>
            {% for comment in comments %}
                <div class="comment-field" style="padding-top: 10px;">
                    {{ comment.name }} 说: {{ comment.content }}
                </div>
            {% endfor %}
        </div>
        <div class="comment-post" style="padding-top: 20px;">
            <h3>提交评论</h3>
            <form action="{% url 'blog_get_detail' blog.id %}" method="post">
                {% csrf_token %}
                {% for field in form %}
                    <div class="input-field" style="padding-top: 10px">
                        {{ field.label }}: {{ field }}
                    </div>
                    <div class="error" style="color: red;">
                        {{ field.errors }}
                    </div>
                {% endfor %}
                <button type="submit" style="margin-top: 10px">提交</button>
            </form>
        </div>
    </div>
</div>
<!--div>
<video width="320" height="240" controls>
  <source src="{% static 'video/hfh.mp4'%}" type="video/mp4">
  <source src="#" type="video/ogg">
  您的浏览器不支持 HTML5 video 标签。
</video>
</div>-->
<!--
<div>
<object id="flowplayer" width="320" height="240"
    data="/static/video/flowplayer-3.2.18.swf"
    type="application/x-shockwave-flash">
    <param name="movie" value="/static/video/flowplayer-3.2.18.swf">
    <param name="flashvars" value='config={"clip":"{% static 'video/hfh.flv'%}"}'>
</object>
</div>

<div>
    <video src="{% static 'video/hfh.mp4'%}" width="320" height="240" controls autoplay loop muted preload="auto" >
HTML5 Video is required for this example
    </video>
</div>
-->
</body>
</html>